<div class="layui-fluid">
  <div class="layui-card">
    <div class="layadmin-search">
      <form class="layui-form" method="post" lay-filter="form_channel_users">
        <script type="text/html" template>
          <div class="layui-inline">
            <div class="layui-form-label">渠道编码</div>
            <div class="layui-input-inline">
              <input type="text" name="channel_code" value="{{layui.router().search.channel_code || ''}}"
                     class="layui-input"
                     placeholder="渠道编码">
            </div>
          </div>
          <div class="layui-inline">
            <div class="layui-form-label">手机号</div>
            <div class="layui-input-inline">
              <input type="text" name="mobile" value="{{layui.router().search.mobile || ''}}" class="layui-input"
                     placeholder="手机号">
            </div>
          </div>
          <div class="layui-inline layui-btn-group">
            <button type="submit" lay-submit class="layui-btn" lay-filter="submit_channel_users">
              <i class="layui-icon layui-icon-search"></i>查询
            </button>
            <button type="submit" lay-submit class="layui-btn layui-btn-warm"
                    lay-filter="reset_channel_users">
              <i class="layui-icon layui-icon-close"></i>重置
            </button>
          </div>
        </script>
      </form>
    </div>
    <div class="layui-card-header">
      渠道汇总
    </div>
    <div class="layui-card-body">
      <div id="table_channels" lay-filter="table_channels"></div>
    </div>
    <div class="layui-card-header">
      用户列表
    </div>
    <div class="layui-card-body">
      <div id="table_channel_users" lay-filter="table_channel_users"></div>
    </div>
  </div>
</div>
<script type="text/html" id="tpl_channel_code">
  <a lay-href="channel/dashboard/channel_code={{d.uuid}}/mobile={{d.mobile}}" class="layui-table-link">
    {{d.uuid}}
  </a>
</script>
<script type="text/html" id="tpl_real_name">
  {{# if (d.auth) { }}
  {{d.auth.real_name}}
  {{# } }}
</script>
<script type="text/html" id="tpl_user">
  {{d.mobile}}
  {{# if (d.nickname) { }}
  ({{d.nickname}})
  {{# } }}
</script>
<script type="text/html" id="tpl_id_card">
  {{# if (d.auth) { }}
  {{d.auth.id_card}}
  {{# } }}
</script>
<script type="text/html" id="tpl_order_amount">
  {{# if (d.order_summary) { }}
  {{d.order_summary.order_amount}}
  {{# } else { }}
  -
  {{# } }}
</script>
<script type="text/html" id="tpl_order_count">
  {{# if (d.order_summary) { }}
  {{d.order_summary.order_count}}
  {{# } else { }}
  -
  {{# } }}
</script>

<script>
  layui.use(['fox_table'], function () {
    let $ = layui.$
      , table = layui.table
      , admin = layui.admin
      , form = layui.form

    loadData()

    function loadData() {
      let search = layui.router().search
      let query_string = '?channel_code=' + search.channel_code + '&mobile=' + search.mobile
      let subChannels = 'agent-admin/channel_summary' + query_string
      // 列表查询
      table.render({
        elem: '#table_channels'
        , url: subChannels
        , page: true
        , cols: [[
          {title: '渠道名称', field: 'name', minWidth: 200}
          , {title: '渠道码', templet: '#tpl_channel_code', width: 200}
          , {title: '用户数量', field: 'user_count', width: 200}
          , {title: '实名数量', field: 'real_user_count', width: 200}
          , {title: '订单数量', field: 'order_count', width: 200}
          , {title: '订单金额', field: 'order_amount', width: 200}
          , {title: '渠道创建时间', field: 'created_at', width: 180, align: "center"}
        ]]
      })

      let channelUsers = 'agent-admin/channel_user_summary' + query_string
      // 列表查询
      table.render({
        elem: '#table_channel_users'
        , url: channelUsers
        , page: true
        , cols: [[
          {title: '用户名', templet: '#tpl_user', minWidth: 200}
          , {title: '真实姓名', templet: '#tpl_real_name', width: 100}
          , {title: '身份证', templet: '#tpl_id_card', width: 200}
          , {title: '订单数量', templet: '#tpl_order_count', width: 100}
          , {title: '订单金额', templet: '#tpl_order_amount', width: 100}
        ]]
      });
    }

    //搜索
    form.on('submit(submit_channel_users)', function (d) {
      location.hash = '/channel/dashboard/channel_code=' + d.field.channel_code + '/mobile=' + d.field.mobile
      loadData()
      return false;
    });
  })
</script>

